<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>MiEdit</title>
    <style type="text/css" media="screen">
        body {
            overflow: hidden;
            border-radius: 4px;
        }

        #editor {
            margin: 0;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
        }
    </style>

</head>

<body>

    <pre id="editor"></pre>




    <script src="ace/ace.js" type="text/javascript" charset="utf-8"></script>
    <script>
        const electron = require('electron');
        const {
            ipcRenderer,
            remote
        } = electron;

        var editor = ace.edit("editor");

        ipcRenderer.send('data');
        ipcRenderer.on('data-back', function (event, theme, mode) {
            editor.setTheme("ace/theme/" + theme);
            editor.getSession().setMode("ace/mode/" + mode);
            editor.setFontSize(18);
        })
        ipcRenderer.on('change-theme', function (event, data) {
            editor.setTheme("ace/theme/" + data);
        })
        ipcRenderer.on('change-mode', function (event, data) {
            editor.getSession().setMode("ace/mode/" + data);
        })
        ipcRenderer.on('open-file', function (event, message, title) {
            editor.setValue(message);
            console.log('open');
        })
        ipcRenderer.on('save-file', function (event) {
            ipcRenderer.send('save-data', editor.getValue());
            console.log('save');
        })

        ipcRenderer.on('save-data', function (event) {
            ipcRenderer.send('save-data-back', editor.getValue());
        })

        //拖放
        var content = document.querySelector("#editor");
        content.ondragenter = content.ondragover = content.ondragleave = function () {
            return false; /*阻止默认行为*/
        }
        content.ondrop = function (event) {
            //阻止默认行为
            event.preventDefault();
            var path = event.dataTransfer.files[0].path;
            ipcRenderer.send("drag-file", path);
        }
    </script>

</body>

</html>